<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Observe Method Test</title>
  </head>
  <body>
    <script src="/sw/register.js" type="module"></script>
    <script type="module">
      import { init } from "/packages/fs/main.js";
      import { test } from "/ok-test/main.js";

      // 初始化测试目录
      const testDir = await init("test-dir-observe");

      // 测试文件变化监听
      await test("Test file change observation", async () => {
        const events = [];
        console.log("开始文件变化观察测试");

        // 创建观察者
        const unobserve = await testDir.observe((event) => {
          console.log("收到文件变化事件:", event);
          events.push(event);
        });
        console.log("已创建观察者");

        // 创建文件并写入内容
        const file = await testDir.get("test.txt", { create: "file" });
        await file.write("Hello " + Math.random());
        console.log("已创建并写入测试文件");

        // 等待事件触发
        await new Promise((resolve) => setTimeout(resolve, 100));
        console.log("第一次等待事件完成");

        // 移除文件
        await file.remove();
        console.log("已移除测试文件");

        // 等待事件触发
        await new Promise((resolve) => setTimeout(resolve, 100));
        console.log("第二次等待事件完成");

        // 取消观察
        unobserve();
        console.log("已取消观察");

        // 再次创建文件（这次不应该触发事件）
        const file2 = await testDir.get("test2.txt", { create: "file" });
        await new Promise((resolve) => setTimeout(resolve, 500));
        console.log("已完成最终测试（创建新文件）");

        return {
          assert: events.length === 2,
          content: `Received ${events.length} events:\n${events
            .map((e) => `- Type: ${e.type}, Path: ${e.path}`)
            .join("\n")}`,
        };
      });

      // 测试子目录变化监听
      await test("Test subdirectory change observation", async () => {
        const events = [];

        // 创建目录结构
        const parentDir = await testDir.get("parent", { create: "dir" });
        const subDir = await parentDir.get("sub", { create: "dir" });

        // 观察父目录
        const unobserve = await parentDir.observe((event) => {
          events.push(event);
        });

        // 在子目录中创建和修改文件
        const file = await subDir.get("test.txt", { create: "file" });
        await file.write("Hello");
        await file.remove();

        // 等待事件触发
        await new Promise((resolve) => setTimeout(resolve, 100));

        // 取消观察
        unobserve();

        return {
          assert: events.length > 0,
          content: `Received ${events.length} events from subdirectory:\n${events
            .map((e) => `- Type: ${e.type}, Path: ${e.path}`)
            .join("\n")}`,
        };
      });

      // 测试多个观察者
      await test("Test multiple observers", async () => {
        const events1 = [];
        const events2 = [];

        // 创建两个观察者
        const unobserve1 = await testDir.observe((event) => {
          events1.push(event);
        });

        const unobserve2 = await testDir.observe((event) => {
          events2.push(event);
        });

        // 创建和删除文件
        const file = await testDir.get("test.txt", { create: "file" });
        await file.remove();

        // 等待事件触发
        await new Promise((resolve) => setTimeout(resolve, 100));

        // 取消观察
        unobserve1();
        unobserve2();

        return {
          assert: events1.length === events2.length,
          content: `Observer 1: ${events1.length} events\nObserver 2: ${events2.length} events`,
        };
      });
    </script>
  </body>
</html>
